<template>
  <div class="pd30 produceFactory">
    <div class="panelWrap">
      <div class="title flex flexac flexjcsb fs14 cfff fwb pl p-r-20">
        <div>入库管理</div>
        <!-- <el-button class="addBtn fw defaultbtn"  type="primary">添加</el-button> -->
      </div>
      <div class="con">
        <div class="con-row flex flexac pl search-box">
          <div class="flex">
            <el-input clearable v-model="queryParam.equipmentName" class="query-input m-r-15" placeholder="设备名称" @input="handleSearch" />
            <el-date-picker
              class="query-input m-r-15"
              v-model="queryParam.endDate"
              value-format="yyyy-MM-dd"
              :picker-options="pickerOption"
              clearable
              type="date"
              placeholder="结束日期">
            </el-date-picker>
            <el-select v-model="queryParam.billStt" class="isWechat-select coInput" placeholder="入库单状态">
              <el-option  label="正常" :value="2" />
              <el-option  label="作废" :value="3" />
            </el-select>
          </div>
          <div class="groupbtn flex m-l-20 ">
            <el-button class="flex flexac fs14" size="small" type="warning" @click="queryStockEnter"><i class="co-i" /><span class="search1">查 询</span></el-button>
            <el-button type="danger" class="defaultbtn" @click="handleDeleteBtn"><i class="el-icon-delete-solid" />删除</el-button>
            <el-button class="flexcenter co-empty m-l-25" type="info" @click="handleEmptySearch"><i class="iconfont icon-qingkong" />清 空</el-button>
            <el-button class="defaultbtn" type="primary" @click="handleAdd"><i class="el-icon-circle-plus-outline" />添加</el-button>
          </div>
        </div>
        
        <el-table
          id="dataList"
          ref="dataList"
          class="con-table"
          type="expand"
          :data="dataList.slice((paging.currentPage - 1) * paging.pageSize, paging.currentPage * paging.pageSize)"
          @select="handleCheck" 
          @select-all="handleCheck" 
          @selection-change="handleCheckChange"
        >
          <el-table-column width="50"  type="selection" label="全选" />

          <el-table-column  align="center" label="设备编号">
            <template slot-scope="scope">
              <span>{{ scope.row.deviceNo }}</span>
            </template>
          </el-table-column>

          <el-table-column align="center" label="BOM ID">
            <template slot-scope="scope">
              <span>{{ scope.row.itemCode }}</span>
            </template>
          </el-table-column>

           <el-table-column align="center" label="入库类型">
            <template slot-scope="scope">
              <el-tag effect="dark" type="success">{{ statusList[scope.row.status] }}</el-tag>
            </template>
          </el-table-column>

          <el-table-column  align="center" label="设备名称">
            <template slot-scope="scope">
              <span>{{ scope.row.equipmentName }}</span>
            </template>
          </el-table-column>


          <el-table-column  label="BOM厂家" align="center">
            <template slot-scope="scope">
              <span>{{ scope.row.companyName }}</span>
            </template>
          </el-table-column>

          <el-table-column  label="物理序列号" align="center">
            <template slot-scope="scope">
              <span>{{ scope.row.serialNo }}</span>
            </template>
          </el-table-column>

          <el-table-column  label="入库时间" align="center">
            <template slot-scope="scope">
              <span>{{ scope.row.enterDate }}</span>
            </template>
          </el-table-column>

          <el-table-column  label="入库性质" align="center">
            <template slot-scope="scope">
              <span>{{ scope.row.nature }}</span>
            </template>
          </el-table-column>

          <el-table-column  label="组织机构" align="center">
            <template slot-scope="scope">
              <span>{{ scope.row.orgNameSimple }}</span>
            </template>
          </el-table-column>

          <el-table-column label="数量" align="center">
            <template slot-scope="scope">
              <span>{{ scope.row.weight }}</span>
            </template>
          </el-table-column>

          <el-table-column label="无税单价" align="center">
            <template slot-scope="scope">
              <span>{{ scope.row.notaxPrice }}</span>
            </template>
          </el-table-column>
          
          <el-table-column label="税率" align="center">
            <template slot-scope="scope">
              <span>{{ scope.row.taxRate }}</span>
            </template>
          </el-table-column>

          <el-table-column label="含税单价" align="center">
            <template slot-scope="scope">
              <span>{{ scope.row.taxPrice }}</span>
            </template>
          </el-table-column>

          <el-table-column label="员工ID" align="center">
            <template slot-scope="scope">
              <span>{{ scope.row.userId }}</span>
            </template>
          </el-table-column>

          <el-table-column label="采购合同ID" align="center">
            <template slot-scope="scope">
              <span>{{ scope.row.purchaseContractId }}</span>
            </template>
          </el-table-column>

          <el-table-column label="状态" align="center">
            <template slot-scope="scope">
              <span>{{ scope.row.billStt === 2 ? '正常' : '作废' }}</span>
            </template>
          </el-table-column>

          <el-table-column prop="name" align="center" label="操作" >
            <template slot-scope="scope">
              <el-button class="defaultbtn" type="primary" plain @click="handleEdit(scope.$index, scope.row)">
                <i class="el-icon-edit" />修改</el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination
          class="paginationWrap flex"
          :current-page="paging.currentPage"
          :page-sizes="paging.pageSizeArr"
          :page-size="paging.pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="paging.total"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
        />
      </div>
    </div>
    <ProductEdit :list="dataList" v-model="visible" :data="editSystem" :is-edit="isEdit" @handleRefresh="handleRefresh" @handleCloseDialog="handleCloseDialog" />
  </div>
</template>
<script>
import ProductEdit from './dialog'
import { fetchStoEnterList, stockEnterDelete } from '@/api/operation/BOM/opStockEnter'
import { fetchProDelete } from '@/api/operation/BOM/opBomProduct'
import { showNotice, formatDateTime } from '@/utils/toolclass'

export default {
  name: 'stockEnter',
  components: {
    ProductEdit
  },
  props: {},
  data() {
    return {
      statusList:{1:'采购入库',3:'退货入库',5:'维修入库'},
      userInfo:{},
      pickerOption:{
        //设置日期禁用状态
        disabledDate(date){
          return date.getTime() > Date.now();
        }
      },
      delPro:'',
      paging: {
        currentPage: 1,
        pageSize: 10,
        pageSizeArr: [10, 20, 50, 100],
        total: 400
      },

      dataList: [],
      queryParam: {
        equipmentName: '',
        billStt: '',
        endDate:''
      },
      visible: false,
      editSystem: {},
      isEdit: false,
      refresh: false,
      url: require('@/assets/error.png'),
      seniorSet: {
        'field': false,
        'sortable': false
      },
      tablehead: [
        {
          index: 0,
          prop: 'name',
          label: '系统名',
          sortable: false,
          fixed: true,
          isShow: true
        },
        {
          index: 1,
          prop: 'id',
          label: '简称',
          sortable: false,
          fixed: true,
          isShow: true
        }
      ]

    }
  },
  computed: {},
  watch: {},
  created() {
    this.getStockEnterList()
  },
  mounted() {
    this.userInfo = JSON.parse(this.$storage.get('userInfo'))
    this.$storage.set('upUrl', JSON.stringify({ 'path': '/operation/ERP/stockEnter/index' }))
  },
  methods: {
    handleCheck(selection, row) {
      this.$refs.dataList.clearSelection()
      if (selection.length === 0) { // 判断selection是否有值存在
        return
      }
      if (row) {
        this.selectioned = row
        this.row = row
        this.delPro = row
        this.$refs.dataList.toggleRowSelection(row, true)
      }
    },
    handleCheckChange(row) {
      if (row.length === 0) {
        this.selectioned = null
      }
    },
    handleDetail(index, row) {
      this.$router.push({
        name: 'system-detail',
        params: { index, row }
      })
    },
    handleSenior(type) {
      if (type === 'field') {
        this.seniorSet.field = !this.seniorSet.field
      }
      if (type === 'sortable') {
        this.seniorSet.sortable = !this.seniorSet.sortable
      }
    },

    handleExportExcel() {
      require.ensure([], () => {
        const { export_json_to_excel } = require('@/excel/Export2Excel')
        const tHeader = ['ID', '母件ID', '物料编码', '厂家', '名称', '性质', 'BOM类型', '备注']
        const filterVal = ['id', 'isSys', 'isDel', 'isWechat', 'sysEntry', 'logo', 'shortName', 'sysName']
        const data = this.formatJson(filterVal, this.dataList)
        export_json_to_excel(tHeader, data, '系统平台表(' + formatDateTime().ymd) + ')'
      })
    },
    formatJson(filterVal, jsonData) {
      return jsonData.map(v => filterVal.map(j => v[j]))
    },
    handleRefresh() {
      this.refresh = true
      this.getStockEnterList()
      setTimeout(() => {
        this.refresh = false
      }, 1200)
    },
    queryStockEnter() {
      const params = {
        equipmentName: this.queryParam.equipmentName,
        endDate:this.queryParam.endDate,
        billStt:this.queryParam.billStt,
        pageIndex: this.paging.currentPage,
        pageSize: this.paging.pageSize
      }
      fetchStoEnterList(params).then(res => {
        this.dataList = res.data.filter(item => {
          if (item.equipmentName.toLowerCase().indexOf(this.queryParam.equipmentName) > -1) {
            return this.dataList.push(item)
          }
        })
        this.handleSearch(this.dataList)
      })
    },
    handleSearch(name) {
      if (this.queryParam.name === '') {
        this.getStockEnterList()
      }
    },
    getStockEnterList() {
      const params = {
        billStt:this.queryParam.billStt,
        pageIndex: this.paging.currentPage,
        pageSize: this.paging.pageSize
      }
      fetchStoEnterList(params).then((res) => {
        if (res.code === '000000') {
          this.dataList = res.data
          const i = res.data.map((item, i) => i)
          this.paging.total = i.length
        }
      })
    },
    handleEmptySearch() {
      this.queryParam = {}
      this.getStockEnterList()
    },
    handleEdit(index, row) {
      console.log(111)
      this.visible = true
      this.isEdit = true
      this.editSystem = {
        enterType: row.status,
        stockOutId: row.stockOutId,
        orgId:row.orgId,
        entId: row.entId,
        entName: row.entName,
        deviceNo: row.deviceNo,
        enterDate:row.enterDate,
        id: row.id,
        productId: row.productId,
        equipmentName : row.equipmentName,
        purchaseContractId: row.purchaseContractId,
        serialNo: row.serialNo,
        taxPrice: row.taxPrice,
        taxRate: row.taxRate,
        userId: row.userId,
        version:row.version
      }
    },
    handleAdd() {
      this.visible = true
      this.isEdit = false
      this.editSystem = {
        orgId:this.userInfo.currentOrgId,
        entId:'',
        deviceNo: '',
        enterDate: '',
        id: '',
        productId: '',
        purchaseContractId: '',
        serialNo: '',
        taxPrice: '',
        taxRate: '0.16',
        stockOutId:'',
        userId:this.userInfo.userId,
        version:1
      }
    },
    handleDeleteBtn() {
      this.$alert('这个操作会删除和它相关联的所有数据,确定要删除吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        showCancelButton: true,
        callback: action => {
          if (action === 'confirm') {
            this.handleDelete()
          }
        }
      })
    },
    handleDelete() {
      const selectDataId = this.delPro.id
      stockEnterDelete(selectDataId).then((res) => {
        if (res.code === '000000') {
          showNotice('success', '提示', '删除成功')
          this.getStockEnterList()
        }
      })
    },
    handleCloseDialog() {
      this.visible = !this.visible
    },
    handleSizeChange(val) {
      this.paging.pageSize = val
      this.getStockEnterList()
    },
    handleCurrentChange(val) {
      this.paging.currentPage = val
      this.getStockEnterList()
    }
  }
}
</script>
<style lang="scss" scoped>
@import '@/styles/public.scss';
.errorImg {
  display: inline-block;
  width: 60px;
  height: 60px;
}
.sys-input {
  width: 260px;
}
.icon-qingkong:before {
  margin-right: 4px;
}
</style>